

// repnse_changeante 
function afficherReponses(id_bloc_gauche,id_liste_question_gauche, id_liste_reponses_gauche, id_bloc_droite, id_liste_question_droite, id_liste_reponses_droite, id_bloc_statut, id_liste_statut, 
								questions, articles, statuts,
								id_bouton_recap, id_recap
								) {
	var bloc_gauche = document.getElementById(id_bloc_gauche);
	var bloc_droite = document.getElementById(id_bloc_droite);
	var liste_question_gauche = document.getElementById(id_liste_question_gauche);
	var liste_reponses_gauche = document.getElementById(id_liste_reponses_gauche);
	var liste_reponses_droite = document.getElementById(id_liste_reponses_droite);
	var liste_question_droite = document.getElementById(id_liste_question_droite);
	var bloc_statut = document.getElementById(id_bloc_statut);
	var liste_statut = document.getElementById(id_liste_statut);
	var bouton_recap = document.getElementById(id_bouton_recap);
	var recapitulatif = document.getElementById(id_recap);
	
	ajouterFonctionsComplementaires(bloc_gauche);
	ajouterFonctionsComplementaires(bloc_droite);
	ajouterFonctionsComplementaires(liste_question_gauche);
	ajouterFonctionsComplementaires(liste_reponses_gauche);
	ajouterFonctionsComplementaires(liste_question_droite);
	ajouterFonctionsComplementaires(liste_reponses_droite);
	ajouterFonctionsComplementaires(recapitulatif);
	
	liste_question_gauche.clearChilds();
	liste_question_droite.clearChilds();
	liste_reponses_droite.clearChilds();
	liste_reponses_gauche.clearChilds();
	
	bloc_gauche.style.display = 'block';
	bloc_droite.style.display = 'block';
	bloc_statut.style.display = 'block';
	
	liste_question_gauche.appendChild(nouvelElement('option'));
	liste_question_droite.appendChild(nouvelElement('option'));
	
	// Remplissage des listes de questions (à gauche et droite)
	for(var k in questions) {
		var option_gauche = nouvelElement('option', {value:questions[k].info.id_question, text:questions[k].info.libelle_question});
		var option_droite = nouvelElement('option', {value:questions[k].info.id_question, text:questions[k].info.libelle_question});
		option_gauche.info_question = questions[k];
		option_droite.info_question = questions[k];
		liste_question_gauche.appendChild(option_gauche);
		liste_question_droite.appendChild(option_droite);
	}
	
	// Remplissage des combos pour les statuts
	for(var k in statuts) {
		var option_statut = nouvelElement('option', {value:statuts[k].StatutsReponse.id_statut_reponse, text:statuts[k].StatutsReponse.libelle_statut_reponse});
		liste_statut.appendChild(option_statut);
	}
	
	var liste_reponses_gauche_el = new Array();
	var liste_reponses_droite_el = new Array();
	
	function remplir_questions_reponses(bloc_questions, bloc_reponses, liste_reponse){
		bloc_reponses.clearChilds();
		var question_changee = bloc_questions.options[bloc_questions.selectedIndex].info_question;
		switch(question_changee.info.type_reponse) {
			case "ENTIER" : 
				var min = nouvelElement('input', {type:'number', name:'min'});
				var max = nouvelElement('input', {type:'number', name:'max'});
				liste_reponse['min'] = min;
				liste_reponse['max'] = max;
				
				bloc_reponses.appendChilds( [
					nouvelElement('span', {textnode:'Spécifier l\'intervalle sur lequel réagir :'}), nouvelElement('br'), 
					nouvelElement('span', {textnode: 'Minimum :'}), min, nouvelElement('br'), 
					nouvelElement('span', {textnode: 'Maximum :'}), max]);
				break;
			case "LISTE" : 
				bloc_reponses.appendChilds([nouvelElement('span', {textnode:'Agir en fonction de la réponse :'}), nouvelElement('br')]);
				liste_reponse['liste'] = new Array();
				for(var k in question_changee.reponses) {
					var macheckbox = nouvelElement('input', {value:question_changee.reponses[k].id_reponse ,type:'checkbox', name:'liste'});
					macheckbox.libelle = question_changee.reponses[k].libelle_reponse_combo;
					liste_reponse['liste'].push(macheckbox);
					bloc_reponses.appendChilds( [ macheckbox, 
						nouvelElement('span', {textnode:' '+question_changee.reponses[k].libelle_reponse_combo}), nouvelElement('br') ]	);
				}
				break;
			case "OUINON" :
				var oui = nouvelElement('input', {type:'radio', name:'ouinon'+question_changee.info.id_question});
				var non = nouvelElement('input', {type:'radio', name:'ouinon'+question_changee.info.id_question});
				liste_reponse['oui'] = oui;
				liste_reponse['non'] = non;
				bloc_reponses.appendChilds([nouvelElement('span', {textnode:'Agir en fonction de la réponse :'}), nouvelElement('br'), 
													nouvelElement('span', {textnode:'oui'}), oui, 
													nouvelElement('span', {textnode:'non'}), non]);
				break;
			case "ARTICLE" :
				var categorie_articles = question_changee.info.id_categorie;
				liste_reponse['article'] = new Array();
				for(var k in articles[categorie_articles].articles) {
					var checkart = nouvelElement('input', {value:articles[categorie_articles].articles[k].id_article ,type:'checkbox', name:'liste'});
					checkart.libelle = articles[categorie_articles].articles[k].description_article;
					checkart.id_article = articles[categorie_articles].articles[k].id_article;
					liste_reponse['article'].push(checkart);
					bloc_reponses.appendChilds([checkart, nouvelElement('span', {textnode:' '+articles[categorie_articles].articles[k].description_article}), nouvelElement('br')]);
				}
				break;
			case "TEXTE" : break;
			default: break;
		}
	}
	
	liste_question_gauche.onchange = function(){remplir_questions_reponses(liste_question_gauche, liste_reponses_gauche, liste_reponses_gauche_el);}
	liste_question_droite.onchange = function(){remplir_questions_reponses(liste_question_droite, liste_reponses_droite, liste_reponses_droite_el);}
	
	// ajout de l'action sur le clic du bouton
	bouton_recap.onclick = function () {
		var lib_question_gauche = liste_question_gauche.options[liste_question_gauche.selectedIndex].text;
		var lib_question_droite = liste_question_droite.options[liste_question_droite.selectedIndex].text;
		var lib_reponse_gauche;
		var lib_reponse_droite;
		var lib_statut = liste_statut.options[liste_statut.selectedIndex].text;
		
		function recuperer_libelle_reponse (question, liste_reponse) {
			var libelle = '';
			
			switch(question.info.type_reponse) {
				case 'LISTE':
					var premier = true;
					for (var k in liste_reponse['liste']) {
						if(liste_reponse['liste'][k].checked) {
							if(premier) premier = false; else libelle += ', ';
							libelle += liste_reponse['liste'][k].libelle;
						}
					}
					break;
				case 'ENTIER':
					libelle = 'de '+liste_reponse['min'].value+' à '+liste_reponse['max'].value+' ';
					break;
				case 'OUINON':
					if(liste_reponse['oui'].checked) libelle = 'oui';
					else if(liste_reponse['non'].checked) libelle = 'non';
					break;
				case 'ARTICLE':
					var premier = true;
					for (var k in liste_reponse['article']) {
						if(premier) premier = false; else libelle += ', ';
						if(liste_reponse['article'][k].checked) libelle += liste_reponse['article'][k].libelle;
					}
					break;
			}
			
			return libelle;
		}
		
		lib_reponse_gauche = recuperer_libelle_reponse(liste_question_gauche.options[liste_question_gauche.selectedIndex].info_question, liste_reponses_gauche_el);
		lib_reponse_droite = recuperer_libelle_reponse(liste_question_droite.options[liste_question_droite.selectedIndex].info_question, liste_reponses_droite_el);
		
		// on ajoute la question 1
		var recapitulatif_text = "Si l'utilisateur répond '"+lib_reponse_gauche+"' à la question '"+lib_question_gauche+
							"', alors la réponse '"+lib_reponse_droite+"' de la question '"+lib_question_droite+"' prend le statut '"+lib_statut+"'.";
		recapitulatif.clearChilds();
		
		// création et ajout du bouton
		var bouton_confirmer = nouvelElement('input', {type:'button', value:"Confirmer"});
		bouton_confirmer.onclick = function(){
			var liste_id_reponse_gauche = new Array();
			var liste_id_reponse_droite = new Array();
			var id_statut = liste_statut.options[liste_statut.selectedIndex].value;
			
			function recuperer_id_reponse(liste_id, liste_question, liste_reponses_el) {
				switch(liste_question.options[liste_question.selectedIndex].info_question.info.type_reponse) {
					case 'LISTE':
						for (var k in liste_reponses_el['liste']) {
							if(liste_reponses_el['liste'][k].checked) {
								var reponse = sendQueryJSON('ajouterReponse', 
															'question='+ encodeURIComponent(liste_question.options[liste_question.selectedIndex].info_question.info.id_question) +
															'&type=liste&libelle=' + encodeURIComponent(liste_reponses_el['liste'][k].libelle),
															'POST');
								liste_id.push(reponse.id_reponse);
							}
						}
						break;
					case 'ARTICLE':
						for (var k in liste_reponses_el['article']) {
							if(liste_reponses_el['article'][k].checked) {
								var reponse = sendQueryJSON('ajouterReponse', 
															'question='+ encodeURIComponent(liste_question.options[liste_question.selectedIndex].info_question.info.id_question) +
															'&type=article&article=' + encodeURIComponent(liste_reponses_el['article'][k].id_article),
															'POST');
								liste_id.push(reponse.id_reponse);
							}
						}
						break;
					case 'ENTIER':
						var reponse = sendQueryJSON('ajouterReponse', 
													'question='+ encodeURIComponent(liste_question.options[liste_question.selectedIndex].info_question.info.id_question) +
													'&type=entier&min='+liste_reponses_el['min'].value+'&max='+liste_reponses_el['max'].value,
													'POST');
						liste_id.push(reponse.id_reponse);
						break;
					case 'OUINON':
						var mareponse = liste_reponses_el['oui'].checked ? "oui" : "non";
						var reponse = sendQueryJSON('ajouterReponse', 
													'question='+ encodeURIComponent(liste_question.options[liste_question.selectedIndex].info_question.info.id_question) +
													'&type=ouinon&reponse='+encodeURIComponent(mareponse),
													'POST');
						liste_id.push(reponse.id_reponse);
						break;
				}
			}
			
			recuperer_id_reponse(liste_id_reponse_gauche, liste_question_gauche, liste_reponses_gauche_el);
			recuperer_id_reponse(liste_id_reponse_droite, liste_question_droite, liste_reponses_droite_el);
			
			// on parcours les id des reponses de gauches, et on ajoute une regle pour chacunes des id des réponses de droites
			for (k1 in liste_id_reponse_gauche) {
				for (k2 in liste_id_reponse_droite) {
					sendQueryJSON('ajouterRegleReponse', 'id_reponse_affectant='+liste_id_reponse_gauche[k1]+'&id_reponse_affectee='+liste_id_reponse_droite[k2]+'&id_statut='+id_statut);
				}
			}
		}
		
		recapitulatif.appendChilds([document.createTextNode(recapitulatif_text), bouton_confirmer]);
	}
}

// affiche la liste des questions dans l'élément voulut
// paramètres :
// - id_select : l'id de l'élément html SELECT où ajouter les questions
// - questions : le tableau de questions
// - articles : le tableau des articles
// - statuts : le tableau des statuts
// - id_out_reponse : id de l'élément HTML où afficher la suite des réponses
// - id_etape_2 : id de l'élément HTML contenant le formulaire pour choisir quel est la question à affectée
// - id_select_etape_2 : id de l'élément html SELECT de l'étape 2 avec la liste des questions
// - id_action : id de l'élément HTML où afficher la liste des actions possibles
// - id_recapitulatif : id de l'élément HTML où afficher le récapitulatif final, avant l'envoie de la requête
// - id_liste_regle : id de l'élément HTML où afficher la liste des règles
function afficherQuestions(id_etape_1, id_select, questions, articles, statuts, id_out_reponse, id_etape_2, id_select_etape_2, id_action, id_recapitulatif, id_liste_regle) {
	// option de l'élément select
	var form_question = document.getElementById(id_etape_1);
	var select = document.getElementById(id_select);
	var out = document.getElementById(id_out_reponse);
	var form_question_affectee = document.getElementById(id_etape_2);
	var select_question_affectee = document.getElementById(id_select_etape_2);
	var action = document.getElementById(id_action);
	var recapitulatif = document.getElementById(id_recapitulatif);
	ajouterFonctionsComplementaires(select);
	ajouterFonctionsComplementaires(out);
	ajouterFonctionsComplementaires(action);
	ajouterFonctionsComplementaires(select_question_affectee);
	ajouterFonctionsComplementaires(recapitulatif);
	
	select.clearChilds();
	
	// affichage du formulaire de l'étape 1
	form_question.style.display = 'block';
	
	select.appendChild(nouvelElement('option'));
	// parcours des questions
	for (key in questions) {
		// ajout du libelle pour l'affichage dans le récapitulatif final
		questions[key].libelle = questions[key].info.libelle_question;
		// ajouts des options pour chaque questions dans le select
		select.appendChild(nouvelElement('option', {value:questions[key].info.id_question, text:questions[key].info.libelle_question, donnee:questions[key]}));
	}
	
	select.onchange = function () {
		action.clearChilds();
		recapitulatif.clearChilds();
		// obtention de l'élément selectionné
		var opt = select.options[select.selectedIndex];
		
		out.clearChilds();
		form_question_affectee.style.display = 'none';
		
		// si c'est bien une question
		if(opt.value) {
			// si c'est une question de type OUINON
			if(opt.donnee.info.type_reponse == 'OUINON') {
				// création des radios oui et non
				var oui = nouvelElement('input', {type:'radio', name:'ouinon'});
				var non = nouvelElement('input', {type:'radio', name:'ouinon'});
				
				//création des éléments de réponses possibles
				var elOui = new Object(), elNon = new Object();
				elOui.libelle = function () {return 'oui';};
				elOui.type = 'OUINON';
				elOui.reponse = 'oui';
				elOui.id_question = opt.donnee.info.id_question;
				elNon.libelle = function () {return 'non';};
				elNon.type = 'OUINON';
				elNon.reponse = 'non';
				elNon.id_question = opt.donnee.info.id_question;
				
				// ajout de l'affichage
				out.appendChilds([nouvelElement('span', {textnode:'Agir en fonction de la réponse :'}), nouvelElement('br'), nouvelElement('span', {textnode:'oui'}), oui, nouvelElement('span', {textnode:'non'}), non]);
				
				// ajout des actions lors du clic sur un radio
				oui.onclick = function () {afficherQuestionAffectee(opt.donnee, form_question_affectee, select_question_affectee, questions, statuts, action, recapitulatif, elOui);};
				non.onclick = function () {afficherQuestionAffectee(opt.donnee, form_question_affectee, select_question_affectee, questions, statuts, action, recapitulatif, elNon);};
			}
			// si c'est une question de type LISTE
			if(opt.donnee.info.type_reponse == 'LISTE') {
				out.appendChilds([nouvelElement('span', {textnode:'Agir en fonction de la réponse :'}), nouvelElement('br')]);
				// affichage de toutes les réponses et de leurs radiobox
				opt.donnee.checks = new Array();
				var listeReponse = new Array();
				for (key in opt.donnee.reponses) {
					var rep = opt.donnee.reponses[key];
					var el = nouvelElement('input', {type:'checkbox', name:'liste', value:opt.donnee.reponses[key].libelle_reponse_combo});
					rep.htmlElement = el;
					opt.donnee.checks.push(el);
					out.appendChilds([nouvelElement('span', {textnode:opt.donnee.reponses[key].libelle_reponse_combo}), el, nouvelElement('br')]);
					
					listeReponse.push(rep);
				}
				var reponse = new Object();
				reponse.type = 'LISTE';
				reponse.id_question = opt.donnee.info.id_question;
				reponse.all = listeReponse;
				reponse.libelle = function () {
					var premier = true;
					var libelle = '';
					for (k in listeReponse) {
						if(listeReponse[k].htmlElement.checked) {
							if(premier) premier = false; else libelle += ' ou ';
							libelle += listeReponse[k].htmlElement.value;
						}
					}
					return libelle;
				};
				afficherQuestionAffectee(opt.donnee, form_question_affectee, select_question_affectee, questions, statuts, action, recapitulatif, reponse);
			}
			// si c'est une question de type ENTIER
			if(opt.donnee.info.type_reponse == 'ENTIER') {
				
				// affichage de la question
				out.appendChilds([nouvelElement('span', {textnode:"Spécifier l'intervalle sur lequel réagir :"}), nouvelElement('br')]);
				// création de l'input Min et Max
				var inputMin = nouvelElement('input', {type:'number'});
				var inputMax = nouvelElement('input', {type:'number'});
				// affichage de l'entrée Min
				out.appendChilds([nouvelElement('span', {textnode:"Valeur min : "}), inputMin, nouvelElement('br')]);
				// affichage de l'entrée Max
				out.appendChilds([nouvelElement('span', {textnode:"Valeur max : "}), inputMax, nouvelElement('br')]);
				// ajout du bouton de validation de l'intervalle
				var inputValiderIntervalle = nouvelElement('input', {type:'button', value:'Valider'});
				out.appendChild(inputValiderIntervalle);
				var erreur = nouvelElement('span', {textnode:"", className:'error-message'});
				erreur.style.display = "none";
				out.appendChild(erreur);
				// ajout de l'action sur le clic du bouton
				inputValiderIntervalle.onclick = function () {
					if(parseFloat(inputMin.value) > parseFloat(inputMax.value)) {
						erreur.changerTexte("La valeur minimum doit être inférieure à la valeur maximale.");
						erreur.style.display = "block";
					}
					else {
						erreur.changerTexte("");
						erreur.style.display = "none";
						// création de la réponse
						var reponse = new Object();
						reponse.type = 'ENTIER';
						reponse.id_question = opt.donnee.info.id_question;
						reponse.valMin = inputMin.value;
						reponse.valMax = inputMax.value;
						reponse.libelle = function () {return 'de ' + inputMin.value + ' à ' + inputMax.value;};
						afficherQuestionAffectee(opt.donnee, form_question_affectee, select_question_affectee, questions, statuts, action, recapitulatif, reponse);
					}
				};
			}
			// si c'est une question de type ARTICLE
			if(opt.donnee.info.type_reponse == 'ARTICLE') {
				// affichage de la question
				out.appendChilds([nouvelElement('span', {textnode:"Choisissez l'article parmis la liste : "}), nouvelElement('br')]);
				// création du select sur les articles
				var selectArticle = nouvelElement('select', {childs:[nouvelElement('option')]});
				// ajout des options du select
				for (key in articles) {
					// si c'est la bonne categorie
					if(key == opt.donnee.info.id_categorie) {
						// on ajoute les articles de cette categorie au select
						for (keyArt in articles[key].articles) {
							selectArticle.appendChild(nouvelElement('option', {value:articles[key].articles[keyArt].id_article, text:articles[key].articles[keyArt].ref_article}));
						}
					}
				}
				// ajout de l'action au changement du select
				selectArticle.onchange = function () {
					// si ce n'est pas l'élément vide
					if(selectArticle.options[selectArticle.selectedIndex].value) {
						// création de la réponse
						var reponse = new Object();
						reponse.type = 'ARTICLE';
						reponse.id_question = opt.donnee.info.id_question;
						reponse.id_article = selectArticle.options[selectArticle.selectedIndex].value;
						reponse.libelle = function () {return selectArticle.options[selectArticle.selectedIndex].text;};
						// on affiche la question avec la réponse à créer
						afficherQuestionAffectee(opt.donnee, form_question_affectee, select_question_affectee, questions, statuts, action, recapitulatif, reponse);
					}
				}
				// ajout du select à l'affichage
				out.appendChild(selectArticle);
			}
		}
	}
}

// affiche la deuxième étape permettant de choisir quelle est la question a affecter
// paramètres :
// - question : la question d'où provient la réponse
// - form : le formulaire à afficher
// - select : l'élément html SELECT où on choisit la question affecté
// - questions : la liste des questions
// - statuts : la liste des statuts
// - action : l'élément HTML où afficher les actions possibles
// - recapitulatif : l'élément HTML où afficher la formule finale et le bouton de validation
// - reponse : la réponse lié à cet événement (reponse.libelle doit exister pour l'affichage)
function afficherQuestionAffectee(question, form, select, questions, statuts, action, recapitulatif, reponse) {
	// on affiche le formulaire
	form.style.display = 'block';
	
	action.clearChilds();
	recapitulatif.clearChilds();
	// on ajoute un élément vide après avoir vidé
	select.clearChilds();
	select.appendChild(nouvelElement('option', {value:undefined, text:''}));
	// parcours des questions
	for (key in questions) {
		select.appendChild(nouvelElement('option', {value:questions[key].info.id_question, text:questions[key].info.libelle_question, donnee:questions[key]}));
	}
	
	// lorsqu'on choisi une question, on affiche les actions possibles
	select.onchange = function () {
		var question_affecte = select.options[select.selectedIndex].donnee;
		action.clearChilds();
		recapitulatif.clearChilds();
		// ajout des boutons activé et desactivé
		var active = nouvelElement('input', {type:'button', value:'Activer'});
		var desactive = nouvelElement('input', {type:'button', value:'Desactiver'});
		
		// ajout des actions des boutons
		active.onclick = function () {
			// création du bouton de validation qui envoie la requête au serveur
			var valider = nouvelElement('input', {type:'button', value:'Valider'});
			valider.onclick = function () {enregistrerRegle(reponse, question_affecte, 'active');}
			// ajout des infos et du bouton dans le récapitulatif
			recapitulatif.clearChilds();
			recapitulatif.appendChilds([
				nouvelElement('span', {textnode:"Si l'utilisateur repond '"+reponse.libelle()+"' à la question '"+question.libelle+"', alors la question '"+question_affecte.libelle+"' est activée."}),
				valider
			]);
		};
		desactive.onclick = function () {
			// création du bouton de validation qui envoie la requête au serveur
			var valider = nouvelElement('input', {type:'button', value:'Validé'});
			valider.onclick = function () {enregistrerRegle(reponse, question_affecte, 'desactive');}
			// ajout des infos et du bouton dans le récapitulatif
			recapitulatif.clearChilds();
			recapitulatif.appendChilds([
				nouvelElement('span', {textnode:"Si l'utilisateur repond '"+reponse.libelle()+"' à la question '"+question.libelle+"', alors la question '"+question_affecte.libelle+"' est désactivée."}),
				valider
			]);
		};
		
		// ajout des boutons à l'élément action
		action.appendChilds([nouvelElement('span', {textnode:'Action à effectuer : '}), active, desactive]);
	}
}

// affiche la liste des questions dans l'élément voulut
// paramètres :
// - id_select : l'id de l'élément html SELECT où ajouter les questions
// - questions : le tableau de questions
// - articles : le tableau des articles
// - statuts : le tableau des statuts
// - id_out_reponse : id de l'élément HTML où afficher la suite des réponses
// - id_etape_2 : id de l'élément HTML contenant le formulaire pour choisir quel est la question à affectée
// - id_select_etape_2 : id de l'élément html SELECT de l'étape 2 avec la liste des questions
// - id_action : id de l'élément HTML où afficher la liste des actions possibles
// - id_recapitulatif : id de l'élément HTML où afficher le récapitulatif final, avant l'envoie de la requête
// - id_liste_regle : id de l'élément HTML où afficher la liste des règles
function afficherQuestionsArticles(id_etape_1, id_select, questions, articles, statuts, id_out_reponse, id_etape_2, id_select_etape_2, id_action, id_recapitulatif, id_liste_regle) {
	// option de l'élément select
	var form_question = document.getElementById(id_etape_1);
	var select = document.getElementById(id_select);
	var out = document.getElementById(id_out_reponse);
	var form_question_affectee = document.getElementById(id_etape_2);
	var select_question_affectee = document.getElementById(id_select_etape_2);
	var action = document.getElementById(id_action);
	var recapitulatif = document.getElementById(id_recapitulatif);
	ajouterFonctionsComplementaires(select);
	select.clearChilds();
	ajouterFonctionsComplementaires(out);
	ajouterFonctionsComplementaires(action);
	ajouterFonctionsComplementaires(select_question_affectee);
	ajouterFonctionsComplementaires(recapitulatif);
	
	// affichage du formulaire de l'étape 1
	form_question.style.display = 'block';
	
	select.appendChild(nouvelElement('option'));
	// parcours des questions
	for (key in questions) {
		// ajout du libelle pour l'affichage dans le récapitulatif final
		questions[key].libelle = questions[key].info.libelle_question;
		// ajouts des options pour chaque questions dans le select
		select.appendChild(nouvelElement('option', {value:questions[key].info.id_question, text:questions[key].info.libelle_question, donnee:questions[key]}));
	}
	
	select.onchange = function () {
		action.clearChilds();
		recapitulatif.clearChilds();
		// obtention de l'élément selectionné
		var opt = select.options[select.selectedIndex];
		
		out.clearChilds();
		form_question_affectee.style.display = 'none';
		
		// si c'est bien une question
		if(opt.value) {
			// si c'est une question de type OUINON
			if(opt.donnee.info.type_reponse == 'OUINON') {
				// création des radios oui et non
				var oui = nouvelElement('input', {type:'radio', name:'ouinon'});
				var non = nouvelElement('input', {type:'radio', name:'ouinon'});
				
				//création des éléments de réponses possibles
				var elOui = new Object(), elNon = new Object();
				elOui.libelle = function () {return 'oui';};
				elOui.type = 'OUINON';
				elOui.reponse = 'oui';
				elOui.id_question = opt.donnee.info.id_question;
				elNon.libelle = function () {return 'non';};
				elNon.type = 'OUINON';
				elNon.reponse = 'non';
				elNon.id_question = opt.donnee.info.id_question;
				
				// ajout de l'affichage
				out.appendChilds([nouvelElement('span', {textnode:'Agir en fonction de la réponse :'}), nouvelElement('br'), nouvelElement('span', {textnode:'oui'}), oui, nouvelElement('span', {textnode:'non'}), non]);
				
				// ajout des actions lors du clic sur un radio
				oui.onclick = function () {afficherCategorieAffectee(opt.donnee, form_question_affectee, select_question_affectee, articles, action, recapitulatif, elOui);};
				non.onclick = function () {afficherCategorieAffectee(opt.donnee, form_question_affectee, select_question_affectee, articles, action, recapitulatif, elNon);};
			}
			// si c'est une question de type LISTE
			if(opt.donnee.info.type_reponse == 'LISTE') {
				out.appendChilds([nouvelElement('span', {textnode:'Agir en fonction de la réponse :'}), nouvelElement('br')]);
				// affichage de toutes les réponses et de leurs radiobox
				opt.donnee.checks = new Array();
				var listeReponse = new Array();
				for (key in opt.donnee.reponses) {
					var rep = opt.donnee.reponses[key];
					var el = nouvelElement('input', {type:'checkbox', name:'liste', value:opt.donnee.reponses[key].libelle_reponse_combo});
					rep.htmlElement = el;
					opt.donnee.checks.push(el);
					out.appendChilds([nouvelElement('span', {textnode:opt.donnee.reponses[key].libelle_reponse_combo}), el, nouvelElement('br')]);
					
					listeReponse.push(rep);
				}
				var reponse = new Object();
				reponse.type = 'LISTE';
				reponse.id_question = opt.donnee.info.id_question;
				reponse.all = listeReponse;
				reponse.libelle = function () {
					var premier = true;
					var libelle = '';
					for (k in listeReponse) {
						if(listeReponse[k].htmlElement.checked) {
							if(premier) premier = false; else libelle += ' ou ';
							libelle += listeReponse[k].htmlElement.value;
						}
					}
					return libelle;
				};
				afficherCategorieAffectee(opt.donnee, form_question_affectee, select_question_affectee, articles, action, recapitulatif, reponse);
			}
			// si c'est une question de type ENTIER
			if(opt.donnee.info.type_reponse == 'ENTIER') {
				
				// affichage de la question
				out.appendChilds([nouvelElement('span', {textnode:"Spécifier l'intervalle sur lequel réagir :"}), nouvelElement('br')]);
				// création de l'input Min et Max
				var inputMin = nouvelElement('input', {type:'number'});
				var inputMax = nouvelElement('input', {type:'number'});
				// affichage de l'entrée Min
				out.appendChilds([nouvelElement('span', {textnode:"Valeur min : "}), inputMin, nouvelElement('br')]);
				// affichage de l'entrée Max
				out.appendChilds([nouvelElement('span', {textnode:"Valeur max : "}), inputMax, nouvelElement('br')]);
				// ajout du bouton de validation de l'intervalle
				var inputValiderIntervalle = nouvelElement('input', {type:'button', value:'Valider'});
				out.appendChild(inputValiderIntervalle);
				var erreur = nouvelElement('span', {textnode:"", className:'error-message'});
				erreur.style.display = "none";
				out.appendChild(erreur);
				// ajout de l'action sur le clic du bouton
				inputValiderIntervalle.onclick = function () {
					if(parseFloat(inputMin.value) > parseFloat(inputMax.value)) {
						erreur.changerTexte("La valeur minimum doit être inférieure à la valeur maximale.");
						erreur.style.display = "block";
					}
					else {
						erreur.changerTexte("");
						erreur.style.display = "none";
						// création de la réponse
						var reponse = new Object();
						reponse.type = 'ENTIER';
						reponse.id_question = opt.donnee.info.id_question;
						reponse.valMin = inputMin.value;
						reponse.valMax = inputMax.value;
						reponse.libelle = function () {return 'de ' + inputMin.value + ' à ' + inputMax.value;};
						afficherCategorieAffectee(opt.donnee, form_question_affectee, select_question_affectee, articles, action, recapitulatif, reponse);
					}
				};
			}
			// si c'est une question de type ARTICLE
			if(opt.donnee.info.type_reponse == 'ARTICLE') {
				// affichage de la question
				out.appendChilds([nouvelElement('span', {textnode:"Choisissez l'article parmis la liste : "}), nouvelElement('br')]);
				// création du select sur les articles
				var selectArticle = nouvelElement('select', {childs:[nouvelElement('option')]});
				// ajout des options du select
				for (key in articles) {
					// si c'est la bonne categorie
					if(key == opt.donnee.info.id_categorie) {
						// on ajoute les articles de cette categorie au select
						for (keyArt in articles[key].articles) {
							selectArticle.appendChild(nouvelElement('option', {value:articles[key].articles[keyArt].id_article, text:articles[key].articles[keyArt].ref_article}));
						}
					}
				}
				// ajout de l'action au changement du select
				selectArticle.onchange = function () {
					// si ce n'est pas l'élément vide
					if(selectArticle.options[selectArticle.selectedIndex].value) {
						// création de la réponse
						var reponse = new Object();
						reponse.type = 'ARTICLE';
						reponse.id_question = opt.donnee.info.id_question;
						reponse.id_article = selectArticle.options[selectArticle.selectedIndex].value;
						reponse.libelle = function () {return selectArticle.options[selectArticle.selectedIndex].text;};
						// on affiche la question avec la réponse à créer
						afficherCategorieAffectee(opt.donnee, form_question_affectee, select_question_affectee, articles, action, recapitulatif, reponse);
					}
				}
				// ajout du select à l'affichage
				out.appendChild(selectArticle);
			}
		}
	}
}

// affiche la deuxième étape permettant de choisir quelle est la categorie a affecter
// paramètres :
// - question : la question d'où provient la réponse
// - form : le formulaire à afficher
// - select : l'élément html SELECT où on choisit la categorie affectée
// - categories : la liste de toutes les categories
// - action : l'élément HTML où afficher les actions possibles
// - recapitulatif : l'élément HTML où afficher la formule finale et le bouton de validation
// - reponse : la réponse lié à cet événement (reponse.libelle doit exister pour l'affichage)
function afficherCategorieAffectee(question, form, select, categories, action, recapitulatif, reponse) {
	// on affiche le formulaire
	form.style.display = 'block';
	
	action.clearChilds();
	recapitulatif.clearChilds();
	// on ajoute un élément vide après avoir vidé
	select.clearChilds();
	select.appendChild(nouvelElement('option', {value:undefined, text:''}));
	// parcours des categories
	for (key in categories) {
		select.appendChild(nouvelElement('option', {value:categories[key].id_categorie, text:categories[key].description_categorie, donnee:categories[key]}));
	}
	
	// lorsqu'on choisi une categorie, on affiche les articles de cette categorie
	select.onchange = function () {
		afficherArticles('article_affecte', 'liste_article_affecte', categories, select.options[select.selectedIndex].value, action, recapitulatif, question, reponse);
	}
}

// affiche la troisieme étape permettant de choisir quel est l'article a affecter
// paramètres :
// - id_etape_3 : id de l'élément HTML contenant le formulaire pour choisir quel est l'article à affecter
// - id_select : l'élément html SELECT où on choisit l'article à affecter
// - listeCategories : la liste de toutes les categories
// - idCategorie : l'id de la categorie selectionnée a l'étape 2, dont il faut faire la liste des articles contenus
// - action : l'élément HTML où afficher les actions possibles
// - recapitulatif : l'élément HTML où afficher la formule finale et le bouton de validation
// - question : la question d'où provient la réponse
// - reponse : la réponse lié à cet événement (reponse.libelle doit exister pour l'affichage)
function afficherArticles(id_etape_3, id_select, listeCategories, idCategorie, action, recapitulatif, question, reponse) {
	// on affiche le formulaire
	var form_article = document.getElementById(id_etape_3);
	form_article.style.display = 'block';
	var select = document.getElementById(id_select);
	ajouterFonctionsComplementaires(select);
	// on ajoute un élément vide après avoir vidé
	select.clearChilds();
	select.appendChild(nouvelElement('option', {value:undefined, text:''}));
	for (c in listeCategories) {
		// si c'est la bonne categorie
		if(c == idCategorie) {
			// on ajoute les articles de cette categorie au select
			for (a in listeCategories[c].articles) {
				select.appendChild(nouvelElement('option', {value:listeCategories[c].articles[a].id_article, text:listeCategories[c].articles[a].ref_article, donnee:listeCategories[c].articles[a]}));
			}
		}
	}
	
	// lorsqu'on choisit un article, on affiche les actions possibles
	select.onchange = function () {
		var article_affecte = select.options[select.selectedIndex].donnee;
		action.clearChilds();
		recapitulatif.clearChilds();
		// ajout des boutons activé et desactivé
		var ajoute = nouvelElement('input', {type:'button', value:'Ajouter au devis'});
		var retire = nouvelElement('input', {type:'button', value:'Retirer du devis'});
		
		// ajout des actions des boutons
		ajoute.onclick = function () {
			// création du bouton de validation qui envoie la requête au serveur
			var valider = nouvelElement('input', {type:'button', value:'Valider'});
			valider.onclick = function () {enregistrerRegleArticle(reponse, article_affecte, 'ajoute');}
			// ajout des infos et du bouton dans le récapitulatif
			recapitulatif.clearChilds();
			recapitulatif.appendChilds([
				nouvelElement('span', {textnode:"Si l'utilisateur repond '"+reponse.libelle()+"' à la question '"+question.libelle+"', alors l'article '"+article_affecte.ref_article+"' est ajouté au devis."}),
				valider
			]);
		};
		retire.onclick = function () {
			// création du bouton de validation qui envoie la requête au serveur
			var valider = nouvelElement('input', {type:'button', value:'Validé'});
			valider.onclick = function () {enregistrerRegleArticle(reponse, article_affecte, 'retire');}
			// ajout des infos et du bouton dans le récapitulatif
			recapitulatif.clearChilds();
			recapitulatif.appendChilds([
				nouvelElement('span', {textnode:"Si l'utilisateur repond '"+reponse.libelle()+"' à la question '"+question.libelle+"', alors l'article '"+article_affecte.ref_article+"' est retiré du devis."}),
				valider
			]);
		};
		
		// ajout des boutons à l'élément action
		action.appendChilds([nouvelElement('span', {textnode:'Action à effectuer : '}), ajoute, retire]);
	}
}

// permet d'ajouter une regle entre une réponse et une question à la base de données
// paramètres :
// - reponse : la réponse, si elle n'a pas d'id, on crée d'abord la réponse dans la bdd à partir de plusieurs élément (reponse.id_question, reponse.type, [reponse.valMin], [reponse.valMax], [article], [oui])
// - question : la question qui est affectée par la réponse
// - action : le type de l'action à appliquer (active, desactive, changerstatut, ajoute, retire)
// - nouveauStatut : l'id du nouveau statut si celui-ci est changé
function enregistrerRegle(reponse, question, action, nouveauStatut) {
	if(reponse.type == 'LISTE') {
		for (k in reponse.all) {
			if(reponse.all[k].htmlElement.checked) {
				if(reponse.all[k].id_reponse == undefined) {
					var result = sendQueryJSON('ajouterReponse', 'question='+reponse.all[k].id_question+'&type=liste&reponse='+reponse.all[k].id_reponse);
					reponse.all[k].id_reponse = result.id_reponse;
				}
				if(sendQueryJSON('ajouterRegle', 'id_reponse='+reponse.all[k].id_reponse+'&id_question='+question.info.id_question+'&action='+action+(nouveauStatut ? '&statut='+nouveauStatut : ''), 'POST').success) {
					alert('La règle à été ajoutée avec succès.');
				}
			}
		}
	}
	else {
		if(reponse.id_reponse == undefined) {
			var result;
			if(reponse.type == 'OUINON') {
				result = sendQueryJSON('ajouterReponse', 'question='+reponse.id_question+'&type=ouinon&reponse='+reponse.reponse, 'POST');
			}
			else if(reponse.type == 'ENTIER') {
				result = sendQueryJSON('ajouterReponse', 'question='+reponse.id_question+'&type=entier&min='+reponse.valMin+'&max='+reponse.valMax, 'POST');
			}
			else if(reponse.type == 'ARTICLE') {
				result = sendQueryJSON('ajouterReponse', 'question='+reponse.id_question+'&type=article&article=' + reponse.id_article);
			}
			reponse.id_reponse = result.id_reponse;
		}

		if(sendQueryJSON('ajouterRegle', 'id_reponse='+reponse.id_reponse+'&id_question='+question.info.id_question+'&action='+action+(nouveauStatut ? '&statut='+nouveauStatut : ''), 'POST').success) {
			alert('La règle à été ajoutée avec succès.');
		}
	}
}

// permet d'ajouter une regle entre une réponse et une question à la base de données
// paramètres :
// - reponse : la réponse, si elle n'a pas d'id, on crée d'abord la réponse dans la bdd à partir de plusieurs élément (reponse.id_question, reponse.type, [reponse.valMin], [reponse.valMax], [article], [oui])
// - article : la question qui est affectée par la réponse
// - action : le type de l'action à appliquer (active, desactive, changerstatut, ajoute, retire)
function enregistrerRegleArticle(reponse, article, action) {
	if(reponse.type == 'LISTE') {
		for (k in reponse.all) {
			if(reponse.all[k].htmlElement.checked) {
				if(reponse.all[k].id_reponse == undefined) {
					var result = sendQueryJSON('ajouterReponse', 'question='+reponse.all[k].id_question+'&type=liste&reponse='+reponse.all[k].id_reponse);
					reponse.all[k].id_reponse = result.id_reponse;
				}
				if(sendQueryJSON('ajouterRegleArticle', 'id_reponse='+reponse.all[k].id_reponse+'&id_article='+article.id_article+'&action='+action, 'POST').success) {
					alert('TODO');
				}
			}
		}
	}
	else {
		if(reponse.id_reponse == undefined) {
			var result;
			if(reponse.type == 'OUINON') {
				result = sendQueryJSON('ajouterReponse', 'question='+reponse.id_question+'&type=ouinon&reponse='+reponse.reponse, 'POST');
			}
			else if(reponse.type == 'ENTIER') {
				result = sendQueryJSON('ajouterReponse', 'question='+reponse.id_question+'&type=entier&min='+reponse.valMin+'&max='+reponse.valMax, 'POST');
			}
			else if(reponse.type == 'ARTICLE') {
				result = sendQueryJSON('ajouterReponse', 'question='+reponse.id_question+'&type=article&article=' + reponse.id_article);
			}
			reponse.id_reponse = result.id_reponse;
		}

		if(sendQueryJSON('ajouterRegleArticle', 'id_reponse='+reponse.id_reponse+'&id_article='+article.id_article+'&action='+action, 'POST').success) {
			alert('TODO');
		}
	}
}

// permet de construire le tableau de base pour la liste des règles
// paramètre :
// - liste_regle : élément HTML où ajouter le tableau des listes de règles
function construireTableauRegle(liste_regle) {
	var table = nouvelElement('table');
	var titre = nouvelElement('tr');
	titre.appendsChild(
	[
		nouvelElement('th', {textnode:'description'}),
		nouvelElement('th', {textnode:'Question'}),
		nouvelElement('th', {textnode:'Reponse'}),
		nouvelElement('th', {textnode:'Question affecte'}),
		nouvelElement('th', {textnode:'Action'})
	]);
	
}

